<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.11.custom.css" rel="Stylesheet" />	

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.jstree.js"></script>
<script>
	jQuery.noConflict();
	jQuery(document).ready(function() {
		jQuery( "#tabs" ).tabs();
		
		jQuery("#tree")
		.bind("loaded.jstree", function (event, data) {
			alert("TREE IS LOADED");
		})
		.jstree({ /* configuration here */ });

	});
	
</script>

<script type="text/javascript" src="atmosJS/2.0.0-crypto-sha1.js"></script>
<script type="text/javascript" src="atmosJS/2.0.0-hmac-min.js"></script>
<script type="text/javascript" src="atmosJS/atmos.js"></script>

<script type="text/javascript">
function listFolder() {
	var esu = new AtmosRest(document.forms.atmos.key.value, document.forms.atmos.uid.value);
	
	var folderHandler = new Object();
	folderHandler.onFailure = function(code) {
		alert( "list folder failed with HTTP " + code );
	}
	folderHandler.onSuccess = function(response) {
		document.forms.atmos.output.value = response;
	}
	
	esu.list(document.forms.atmos.root.value, folderHandler);
}


</script>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Drop.Atmos</title>
</head>
<body>



<div class="ui-widget ui-widget-header"><h1>Drop.Atmos</h1></div>
<div class="ui-widget widget-content">
<p>Drop.Atmos is a file sharing site powered by EMC Atmos Cloud Storage.  Use your credentials to upload files, manage files, and share files with your friends and co-workers!
</div>
<div id="tabs">
	<ul>
		<li><a href="#tabs-1">Credentials</a></li>
		<li><a href="#tabs-2">Create a new Drop</a></li>
		<li><a href="#tabs-3">Manage / Share Drop contents</a></li>
	</ul>
	<div id="tabs-1">
		<p>Use the form below to configure your Atmos credentials.
		<form id="atmos">
		<table>
		<tr><td>UID</td><td><input id="uid" type="text" value="connectic"></td></tr>
		<tr><td>Key</td><td><input id="key" type="text" value="D7qsp4j16PBHWSiUbc/bt3lbPBY="></td></tr>
		<tr><td>dir</td><td><input id="root" type="text" value="/connectic/"></td></tr>
		</table>
		</form>
	</div>
	<div id="tabs-2">
		<p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus gravida ante, ut pharetra massa metus id nunc. Duis scelerisque molestie turpis. Sed fringilla, massa eget luctus malesuada, metus eros molestie lectus, ut tempus eros massa ut dolor. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.</p>
	</div>
	<div id="tabs-3">
		<div id="tree" style="width:200px;"></div>
	</div>
</div>


</body>
</html>
